<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no" />
    <link rel="stylesheet" href="__CSS__/common.css">
    <link rel="stylesheet" href="__CSS__/register.css">
    <title>注册</title>
</head>
<body class="black">
<form method="post" action="{:url('login/reg')}">
    <div class="register-box">

        <dl class="buf_item">
            <dt>手机号</dt>
            <dd>
                <input type="text" id="phone" name="mobile">
            </dd>
            <input type="hidden" id="session_id" name="session_id"/>
            <button class="yzm" onclick="return sendCode();">获取验证码</button>
        </dl>
        <dl class="buf_item">
            <dt>验证码</dt>
            <dd>
                <input type="text" id="code" name="code">
            </dd>
        </dl>
        <dl class="buf_item">
            <dt>设置密码</dt>
            <dd>
                <input type="password" id="upwd" name="password">
            </dd>
        </dl>

    </div>
    <button class="btn" type="button" onclick="return reg();">注 册</button>
</form>
</body>
<script src="__JS__/jquery.min.js"></script>
<script src="__JS__/layer.js"></script>
<script src="__JS__/register.js"></script>
<script type="text/javascript">
    function sendCode() {
        var phone=$('#phone').val().trim();
        var phoneReg=/^[0-9]{11}$/;
        if(!phone) {
            layer.msg("请输入手机号", {time: 1500})
        }else if(!phoneReg.test(phone)){
            layer.msg("请输入正确的手机号码", {time: 1500})
        }else{
            //var phone=$('#phone').val().trim();
            $.ajax({
                type:'post',
                url:'{:url("login/sendCode")}',
                data:{mobile:phone},
                success:function (data){
                    if(data.code==1) $("#session_id").val(data.data.session_id);
                    layer.msg(data.msg,{time:1500});
                },
                error:function () {

                }
            });
            //获取验证码
            var time=60;
            var timer=setInterval(function(){
                time--;
            $('.yzm').html(time+'秒');
            if(time<=0){
                clearInterval(timer);
                $('.yzm').html('再次获取');
            }
        },1000);
        }
        return false;
    }
    function reg() {
        var phone=$('#phone').val().trim();
        var code=$('#code').val().trim();
        var upwd=$('#upwd').val().trim();
        if(!phone){layer.msg("请输入手机号",{time:1500})}
        else if(!code){layer.msg("请输入验证码",{time:1500})}
        else if(!upwd){layer.msg("请输入密码",{time:1500})}
        else{
            $.ajax({
                type:'post',
                url:$("form").attr('action'),
                data:$("form").serialize(),
                success:function (data){
                    if(data.code==1){
                        layer.msg("注册成功",{time:1500});
                        location.href='{:url("index/index")}'
                    }else{
                        layer.msg(data.msg,{time:1500});
                    }
                },
                error:function () {

                }

            })
        }
        return false;
    }
</script>
</html>